<template>
	<view class="content">
		<view class="top">
			<text>教练端</text>
		</view>
		<image class="logo" src="/static/logo.png"></image>
		<view class="center1">
			<text>欢迎来到~</text>
		</view>
		<view class="center2">
			<text>Liven健身大家庭</text>
		</view>
		<view class="center3">
			<view class="center3-1">
				<view style="float: left;height: 50rpx;width: 50rpx;margin-right: 1vw;">
					<image class="phone" src="/static/phone.png"></image>
				</view>
				<view style="float: left;height: 50rpx;width: 69vw">
					<u--input v-model="form.coachPhone" placeholder="请输入内容" border="none" clearable
						style="width: 400rpx;"></u--input>
				</view>
			</view>
			<view style="width: 20prx;height: 20rpx"></view>
			<view class="center3-2">
				<view style="float: left;height: 50rpx;width: 50rpx;margin-right: 1vw;">
					<image class="phone" src="/static/lock.png"></image>
				</view>
				<view style="float: left;height: 50rpx;width: 69vw">
					<u-input v-model="form.coachPassword" placeholder="请输入内容" border="none" type="password" clearable
						style="width: 400rpx;"></u-input>
				</view>
			</view>
			<view class="login">
				<uv-toast ref="toast"></uv-toast>
				<u-button text="登录" color="linear-gradient(to bottom right,  #94A9FD,#9ECFFF,#b9e1ff)" size="large"
					@click="login()"></u-button>
			</view>
		</view>
		<view class="bottom">
			<view style="width:6vw;height: 50vpx;float: left;margin-top: 4rpx;">
				<u-checkbox-group v-model="checkboxValue1" placement="column" @change="checkboxChange" shape="circle">
					<u-checkbox>
					</u-checkbox>
				</u-checkbox-group>
			</view>
			<view style="width:79vw;height: 50vpx;float: left;">
				<text style="font-size: 26rpx;">
					我已阅读并同意
					<text style="color: #FF8D1A;">《用户服务协议》</text>
					、
					<text style="color: #FF8D1A;">《隐私政策》</text>
					等协议
				</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				checkboxValue1: [],
				form: {
					coachPhone: '',
					coachPassword: ''
				},
				forms:{
				}
			}
		},
		onLoad() {

		},
		methods: {
			checkboxChange(n) {
				console.log('change', this.checkboxValue1);
			},
			selelctInfo(){
				var ths = this;
				uni.request({
					url: 'http://127.0.0.1:17000/AppCoach/getCoachById',
					method: 'GET',
					data: {
						id: uni.getStorageSync('teacherinfo').id
					},
					success: function(res) {
						if (res.data.code == 200) {
							ths.forms = res.data.data
							uni.setStorageSync('venuename', ths.forms.userName)
						}
					},
					fail: function(error) {
						// 处理请求失败
						console.error('上传课程失败，请检查网络');
					}
				})
			},
			login() {
				console.log(this.form);
				if (this.checkboxValue1.length !== 0) {

					var ths = this;
					uni.request({
						url: this.URL + 'teacherReservation/coachLogin',
						method: 'POST',
						data: this.form,
						success: function(res) {
							if (res.data.data.code == 200) {
								uni.setStorageSync('teacherinfo', res.data.data.data)
								ths.selelctInfo()
								wx.switchTab({
									url: '/pages/home/anpai'
								});
							}
							uni.showToast({
								type: 'error',
								title: res.data.data.data,
								icon: 'none',
								duration: 2000
							});
						},
						fail: function(error) {
							// 处理请求失败
							console.error('登录失败');
						}
					})
				} else {
					uni.showModal({
						content: "请确认用户协议",
						showCancel: false,
						confirmText: "确定",
						success: (res) => {

						}
					});
				}
			},
		}
	}
</script>

<style>
	.top {
		margin-top: 150rpx;
		color: #6d8cdb;
		letter-spacing: 5rpx;
		font-size: 40rpx;
	}

	.center1 {
		color: #6d8cdb;
		font-size: 34rpx;
		letter-spacing: 5rpx;
		margin-bottom: 30rpx;
	}

	.center2 {
		color: #6d8cdb;
		font-size: 50rpx;
		letter-spacing: 5rpx;
		margin-bottom: 40rpx;
	}

	.center3 {
		margin-bottom: 30rpx;
		width: 80vw;
	}

	.center3-1 {
		width: 100%;
		height: 60rpx;
		border-bottom: solid 1px #6d8cdb;
		margin-bottom: 20rpx;
	}

	.center3-2 {
		width: 100%;
		height: 60rpx;
		border-bottom: solid 1px #6d8cdb;
		margin-bottom: 30rpx;
	}

	.bottom {
		width: 85vw;
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 300rpx;
		width: 300rpx;
		margin-top: 20rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20rpx;
	}

	.phone {
		height: 50rpx;
		width: 50rpx;
		margin-top: -5rpx;
	}

	.login {
		width: 250rpx;
		margin: 0 auto;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>